<!-- 基础页面外壳 -->

<!-- 属性 -->
<!-- 配置名称 | 类型 | 用途 | 返回值 | 默认值 | 必填 | 说明 -->
<!-- fullscreen | boolean | 是否全屏 | - | false | - | 无 -->

<!-- 事件 -->
<!-- 事件名 | 说明 | Type -->
<!-- 无 -->

<!-- 插槽 -->
<!--
  无
-->

<!-- expose -->
<!-- 方法名 | 说明 | Type -->
<!-- 无 -->
<script setup lang="ts">
interface Props {
  fullscreen?: boolean
}

const { fullscreen = false } = defineProps<Props>()
</script>

<template>
  <div
    :class="{
      'base-page-wrapper': true,
      'base-page-wrapper-fullscreen': !!fullscreen
    }"
  >
    <slot></slot>
  </div>
</template>

<style lang="scss" scoped>
.base-page-wrapper {
  @include rect(100%, 100%);
  box-sizing: border-box;
  overflow: auto;
}
.base-page-wrapper-fullscreen {
  @include rect(100%, 100%);
  min-width: 1440px;
  background: #ffffff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  overflow: auto;
}
</style>
